import { NCode, NDrawer, NDrawerContent } from "naive-ui";
import { isVieJson,viewJsonCode } from "@/hooks/useWflow";
import hljs from "highlight.js/lib/core";
import json from "highlight.js/lib/languages/json";
hljs.registerLanguage("json", json);

export default defineComponent({
  name: "ViewCode",
  setup() {
    return () => (
      <NDrawer v-model:show={isVieJson.value} width="902">
        <NDrawerContent title="JSON预览" closable nativeScrollbar={false}>
          <NCode
            code={viewJsonCode.value!}
            language="json"
            wordWrap={true}
            hljs={hljs}
          ></NCode>
        </NDrawerContent>
      </NDrawer>
    );
  },
});
